<template>
  <div>
    <el-button class="hand-btn" type="primary" icon="el-icon-back" @click="goBack">返回</el-button>
    <el-card style="margin-top: 10px;margin-left: 2%;margin-right:2%">
      <el-card>
        <el-descriptions border>
          <el-descriptions-item label="方案名称">{{ quality.projectName }}</el-descriptions-item>
          <el-descriptions-item label="产品名称">{{ quality.productName }}</el-descriptions-item>
          <el-descriptions-item label="检测简称">{{ quality.name }}</el-descriptions-item>
          <el-descriptions-item label="检测描述">{{ quality.describe }}</el-descriptions-item>
          <el-descriptions-item label="创建时间">{{quality.createTime}}</el-descriptions-item>
          <el-descriptions-item label="创建人">{{quality.createBy}}</el-descriptions-item>
        </el-descriptions>
      </el-card>
      <el-table
        :data="quality.titles"
        tooltip-effect="dark"
        :show-header="false"
        border
        style="width: 100%;"
      >
        <el-table-column
          prop="name"
          width="200px"
        />
        <el-table-column
          prop="describe"
        />
      </el-table>
      <el-table
        :data="quality.entitys"
        tooltip-effect="dark"
        border
        style="width: 100%;"
      >
        <el-table-column
          type="index"
          label="项次"
          width="50"
        />
        <el-table-column
          prop="planName"
          width="150px"
          label="测试项目"
        />
        <el-table-column
          prop="quotaName"
          width="150px"
          label="测试指标"
        />
        <el-table-column
          prop="specs"
          width="150px"
          label="规格"
        />
        <el-table-column
          prop="no1"
          width="120px"
          label="NO.1"
        >
        </el-table-column>
        <el-table-column
          prop="no2"
          width="120px"
          label="NO.2"
        >
        </el-table-column>
        <el-table-column
          prop="no3"
          width="120px"
          label="NO.3"
        >
        </el-table-column>
        <el-table-column
          prop="no4"
          width="120px"
          label="NO.4"
        >
        </el-table-column>
        <el-table-column
          prop="no5"
          width="120px"
          label="NO.5"
        >
        </el-table-column>
        <el-table-column
          prop="judge"
          width="90px"
          label="系统"
        />
        <el-table-column
          prop="result"
          width="110px"
          label="人工"
        >
        </el-table-column>
      </el-table>
    </el-card>
  </div>
</template>
<script>
import { get } from '@/api/quality'
export default {
  name: 'QualityView',
  data() {
    return {
      quality: { baseProduct: {}}
    }
  },
  created() {
    this.getQuality(this.$route.query.id)
  },
  methods: {
    // 获取 easy-mock 的模拟数据
    getQuality(id) {
      get(id).then(res => {
        console.log(res)
        this.quality = res.data.data
      })
    },

    goBack() {
      this.$router.back()
    }
  }
}
</script>

<style scoped>
  .handle-box {
    margin: 20px;
  }

  .handle-select {
    width: 120px;
  }

  .handle-input {
    margin: 10px;
    width: 300px;
    display: inline-block;
  }
  .table {
    width: 100%;
    font-size: 14px;
  }
  .red {
    color: #ff0000;
  }
  .hand-btn {
    margin: 5px;
  }
</style>
